<template>
   <el-card class="box-card">
            <div slot="header" class="clearfix"><span>账号绑定</span></div>
            <el-row>
              <el-col :span="1">
                <div>
                  <el-avatar
                    :size="30"
                    :src="circleUrl"
                    class="tubiao"
                  ></el-avatar>
                </div>
              </el-col>
              <el-col :span="9">绑定手机号码</el-col>
              <el-col :span="12">当前未绑定绑定手机号码</el-col>
              <el-col :span="2"
                ><el-link type="primary">绑定/更换</el-link></el-col
              >
            </el-row>
            <el-divider></el-divider>
            <el-row>
              <el-col :span="1">
                <div>
                  <el-avatar
                    :size="30"
                    :src="circleUrl"
                    class="tubiao"
                  ></el-avatar>
                </div>
              </el-col>
              <el-col :span="9">绑定邮箱</el-col>
              <el-col :span="12">当前未绑定绑定邮箱账号</el-col>
              <el-col :span="2"
                ><el-link type="primary">绑定/更换</el-link></el-col
              >
            </el-row>
            <el-divider></el-divider>
            <el-row>
              <el-col :span="1">
                <div>
                  <el-avatar
                    :size="30"
                    :src="circleUrl"
                    class="tubiao"
                  ></el-avatar>
                </div>
              </el-col>
              <el-col :span="9">绑定QQ</el-col>
              <el-col :span="12">当前未绑定绑定QQ账号</el-col>
              <el-col :span="2"
                ><el-link type="primary">绑定/更换</el-link></el-col
              >
            </el-row>
            <el-divider></el-divider>
            <el-row>
              <el-col :span="1">
                <div>
                  <el-avatar
                    :size="30"
                    :src="circleUrl"
                    class="tubiao"
                  ></el-avatar>
                </div>
              </el-col>
              <el-col :span="9">绑定微信</el-col>
              <el-col :span="12">当前未绑定绑定微信账号</el-col>
              <el-col :span="2"
                ><el-link type="primary">绑定/更换</el-link></el-col
              >
            </el-row>
            <el-divider></el-divider>
            <el-row>
              <el-col :span="1">
                <div>
                  <el-avatar
                    :size="30"
                    :src="circleUrl"
                    class="tubiao"
                  ></el-avatar>
                </div>
              </el-col>
              <el-col :span="9">绑定支付宝</el-col>
              <el-col :span="12">当前未绑定绑定支付宝账号</el-col>
              <el-col :span="2"
                ><el-link type="primary">绑定/更换</el-link></el-col
              >
            </el-row>
            <el-divider></el-divider>
            <el-row>
              <el-col :span="1">
                <div>
                  <el-avatar
                    :size="30"
                    :src="circleUrl"
                    class="tubiao"
                  ></el-avatar>
                </div>
              </el-col>
              <el-col :span="9">绑定微博</el-col>
              <el-col :span="12">当前未绑定绑定微博账号</el-col>
              <el-col :span="2"
                ><el-link type="primary">绑定/更换</el-link></el-col
              >
            </el-row>
            <el-divider></el-divider>
            <el-row>
              <el-col :span="1">
                <div>
                  <el-avatar
                    :size="30"
                    :src="circleUrl"
                    class="tubiao"
                  ></el-avatar>
                </div>
              </el-col>
              <el-col :span="9">绑定Github</el-col>
              <el-col :span="12">当前未绑定绑定Github账号</el-col>
              <el-col :span="2"
                ><el-link type="primary">绑定/更换</el-link></el-col
              >
            </el-row>
            <el-divider></el-divider>
          </el-card>
</template>

<script>
  export default {
    name: 'Bind',
    components: {},
    data() {
      return {
       circleUrl: "https://cube.elemecdn.com/3/7c/3ea6beec64369c2642b92c6726f1epng.png", };
    },
    created() {},
    methods: {}, 
  };
</script>
<style lang="scss" scoped>
.box-card {
    font-size: 14px;
    letter-spacing: 0.5px;
    .tubiao {
      margin: -7px 0px 0px 0px;
    }
  }
</style>